<template>
	<view class="theme-switcher">
		<u-switch v-model="isDarkMode" @change="toggleTheme" activeColor="#4cd964" inactiveColor="#f0f0f0"></u-switch>
	</view>
</template>

<script>
/**
 * @description 主题切换组件
 * @author TickTock团队
 */
import { mapState, mapActions } from 'vuex';

export default {
	name: 'ThemeSwitcher',
	computed: {
		...mapState(['currentTheme']),
		isDarkMode: {
			get() {
				return this.currentTheme === 'dark';
			},
			set() {
				// 通过toggleTheme方法处理
			}
		}
	},
	methods: {
		...mapActions(['toggleTheme'])
	}
}
</script>

<style lang="scss" scoped>
.theme-switcher {
	display: flex;
	align-items: center;
	justify-content: center;
}
</style> 